<template>
	<div class="about">
	   <h1 class="a1">路由</h1>
	   <el-container>
	      <el-aside width="200px">
	         <el-menu
	               default-active="/"
	               class="el-menu-vertical-demo"
	               background-color="#545c64"
	               text-color="#fff"
	               active-text-color="#ffd04b"
	               @select="onSelect">
	            <el-menu-item>
	               <i class="el-icon-menu"></i>
	               <span slot="title">会员列表</span>
	            </el-menu-item>
	            <el-menu-item>
	               <i class="el-icon-document"></i>
	               <span slot="title">会员等级</span>
	            </el-menu-item>
	         </el-menu>
	      </el-aside>
	      <el-main>
	         <router-view></router-view>
	      </el-main>
	   </el-container>
	</div>
</template>

<script>
	export default {
	   data() {
	      return {}
	   },
	   mounted(index) {
	      this.$router.push(index)
	   },
	   methods: {
	      onSelect(index, indexPath) {
	         console.log(index, indexPath);
	         this.$router.push(index)
	      }
	   }
	}
</script>

<style lang="scss" scoped>
   .el-aside {
      background-color: #D3DCE6;
      color: #333;
      line-height: 100vh;
      height: 100vh;

      .el-menu {
         height: 100vh;
      }
   }

   .el-main {
      background-color: #E9EEF3;
      color: #333;
      text-align: center;
      line-height: 160px;
   }
   .a1{
      margin-left:600px ;
   }


</style>
